<!DOCTYPE html>
            
<HTML>
<HEAD>
<meta name="booktitle" content="Developing Applications With Objective Caml" >
 <meta charset="ISO-8859-1"><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<META name="GENERATOR" content="hevea 1.05-7 of 2000-02-24">
<META NAME="Author" CONTENT="Christian.Queinnec@lip6.fr">
<LINK rel=stylesheet type="text/css" href="videoc-ocda.css">
<script language="JavaScript" src="videoc.js"><!--
//--></script>
<TITLE>
 Graphical display
</TITLE>
</HEAD>
<BODY class="regularBody">
<A HREF="book-ora047.html"><IMG SRC ="previous_motif.gif" ALT="Previous"></A>
<A HREF="index.html"><IMG SRC ="contents_motif.gif" ALT="Contents"></A>
<A HREF="book-ora049.html"><IMG SRC ="next_motif.gif" ALT="Next"></A>
<HR>

<H2> Graphical display</H2>The elements of the graphical display are: the reference point and the
graphical context, the colors, the drawings, the filling pattern of
closed forms, the texts and the bitmaps.<BR>
<BR>
<A NAME="toc60"></A>
<H3> Reference point and graphical context</H3>The <TT>Graphics</TT> library manages a unique main window. The
coordinates of the reference point of the window range from point (0,0)
at the bottom left to the upper right corner of the window. The main
functions on this window are:
<A NAME="@fonctions147"></A>
<A NAME="@fonctions148"></A>
<A NAME="@fonctions149"></A><BR>
<BR>
<UL>
<LI>
 <TT>open_graph</TT>, of type <I>string -&gt; unit</I>, which opens a window;

<LI> <TT>close_graph</TT>, of type <I>unit -&gt; unit</I>, which closes it;

<LI> <TT>clear_graph</TT>, of type <I>unit -&gt; unit</I>, which clears it.
</UL>
The dimensions of the graphical window are given by the functions
<TT>size_x</TT> and <TT>size_y</TT>.<BR>
<BR>
The string argument of the function <TT>open_graph</TT> depends on the
window system of the machine on which the program is executed and is
therefore not platform independent. The empty string, however, opens a
window with default settings. It is possible to specify the size of the
window: under X-Windows, <CODE>" 200x300"</CODE> yields a window which is
200 pixels wide and 300 pixels high. Beware, the space at the beginning
of the string <CODE>" 200x300"</CODE> is required!<BR>
<BR>
The graphical context contains a certain number of readable and/or
modifiable parameters:<BR><A NAME="@fonctions150"></A>
<A NAME="@fonctions151"></A>
<A NAME="@fonctions152"></A>
<A NAME="@fonctions153"></A>
<A NAME="@fonctions154"></A>
<A NAME="@fonctions155"></A>
<TABLE CELLSPACING=2 CELLPADDING=0>
<TR><TD  ALIGN=right NOWRAP>the current point:</TD>
<TD  ALIGN=left NOWRAP><TT>current_point</TT> : <I>unit -&gt; int * int</I></TD>
</TR>
<TR><TD  ALIGN=right NOWRAP>&nbsp;</TD>
<TD  ALIGN=left NOWRAP><TT>moveto</TT> : <I>int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=right NOWRAP>the current color:</TD>
<TD  ALIGN=left NOWRAP><TT>set_color</TT> : <I>color -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=right NOWRAP>the width of lines:</TD>
<TD  ALIGN=left NOWRAP><TT>set_line_width</TT> : <I>int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=right NOWRAP>the current character font:</TD>
<TD  ALIGN=left NOWRAP><TT>set_font</TT> : <I>string -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=right NOWRAP>the size of characters:</TD>
<TD  ALIGN=left NOWRAP><TT>set_text_size</TT> : <I>int -&gt; unit</I></TD>
</TR></TABLE><BR>
<A NAME="toc61"></A>
<H3> Colors</H3>
<A NAME="sec-couleur"></A><A NAME="@fonctions156"></A>
<A NAME="@fonctions157"></A>Colors are represented by three bytes: each stands for the intensity
value of a main color in the RGB-model (red, green, blue), ranging from
a minimum of 0 to a maximum of 255. The function <TT>rgb</TT> (of
type <I>int -&gt; int -&gt; int -&gt; color</I>) allows the generation of a new
color from these three components. If the three components are identical,
the resulting color is a gray which is more or less intense depending on
the intensity value. Black corresponds to the minimum intensity of each
component (<CODE>0</CODE><CODE> </CODE><CODE>0</CODE><CODE> </CODE><CODE>0</CODE>) and white is the maximum (<CODE>2</CODE><CODE>5</CODE><CODE>5</CODE><CODE> </CODE><CODE>2</CODE><CODE>5</CODE><CODE>5</CODE><CODE> </CODE><CODE>2</CODE><CODE>5</CODE><CODE>5</CODE>).
Certain colors are predefined: <TT>black</TT>, <TT>white</TT>,
<TT>red</TT>, <TT>green</TT>, <TT>blue</TT>, <TT>yellow</TT>,
<TT>cyan</TT> and <TT>magenta</TT>.<BR>
<BR>
<A NAME="@fonctions158"></A>
<A NAME="@fonctions159"></A><BR>
<BR>
The variables <TT>foreground</TT> and <TT>background</TT> correspond
to the color of the fore- and the background respectively. Clearing the
screen is equivalent to filling the screen with the background color.<BR>
<BR>
A color (a value of type <I>color</I>) is in fact an integer which
can be manipulated to, for example, decompose the color into its three
components (<TT>from_rgb</TT>) or to apply a function to it that inverts
it (<TT>inv_color</TT>).


<PRE><BR><CODE>(* color == R * 256 * 256  +  G * 256  +  B  *)</CODE><BR># <B>let</B><CODE> </CODE>from_rgb<CODE> </CODE><TT>(</TT>c<CODE> </CODE><CODE>:</CODE><CODE> </CODE>Graphics.color<TT>)</TT><CODE> </CODE><CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>r<CODE> </CODE><CODE>=</CODE><CODE> </CODE>c<CODE> </CODE><CODE>/</CODE><CODE> </CODE><CODE>6</CODE><CODE>5</CODE><CODE>5</CODE><CODE>3</CODE><CODE>6</CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE><CODE> </CODE>g<CODE> </CODE><CODE>=</CODE><CODE> </CODE>c<CODE> </CODE><CODE>/</CODE><CODE> </CODE><CODE>2</CODE><CODE>5</CODE><CODE>6</CODE><CODE> </CODE><B>mod</B><CODE> </CODE><CODE>2</CODE><CODE>5</CODE><CODE>6</CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE><CODE> </CODE>b<CODE> </CODE><CODE>=</CODE><CODE> </CODE>c<CODE> </CODE><B>mod</B><CODE> </CODE><CODE>2</CODE><CODE>5</CODE><CODE>6</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE><TT>(</TT>r<CODE>,</CODE>g<CODE>,</CODE>b<TT>)</TT>;;<BR><CODE>val from_rgb : Graphics.color -&gt; int * int * int = &lt;fun&gt;</CODE><BR># <B>let</B><CODE> </CODE>inv_color<CODE> </CODE><TT>(</TT>c<CODE> </CODE><CODE>:</CODE><CODE> </CODE>Graphics.color<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>r<CODE>,</CODE>g<CODE>,</CODE>b<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>from_rgb<CODE> </CODE>c<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE>Graphics.rgb<CODE> </CODE><TT>(</TT><CODE>2</CODE><CODE>5</CODE><CODE>5</CODE><CODE>-</CODE>r<TT>)</TT><CODE> </CODE><TT>(</TT><CODE>2</CODE><CODE>5</CODE><CODE>5</CODE><CODE>-</CODE>g<TT>)</TT><CODE> </CODE><TT>(</TT><CODE>2</CODE><CODE>5</CODE><CODE>5</CODE><CODE>-</CODE>b<TT>)</TT>;;<BR><CODE>val inv_color : Graphics.color -&gt; Graphics.color = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
<A NAME="@fonctions160"></A>
The function <TT>point_color</TT>, of type <I>int -&gt; int -&gt; color</I>,
returns the color of a point when given its coordinates.<BR>
<BR>
<A NAME="toc62"></A>
<H3> Drawing and filling</H3><A NAME="sub-traces-remplissage"></A>
A drawing function draws a line on the screen. The line is of the current
width and color. A filling function fills a closed form with the current
color. The various line- and filling functions are presented in figure
<A HREF="book-ora048.html#fig-fngraph">5.1</A>.<BR>
<BR>
<A NAME="@fonctions161"></A>
<A NAME="@fonctions162"></A>
<A NAME="@fonctions163"></A>
<A NAME="@fonctions164"></A>
<A NAME="@fonctions165"></A>
<A NAME="@fonctions166"></A>
<A NAME="@fonctions167"></A>
<BLOCKQUOTE><DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV>
<DIV ALIGN=center>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=1>
<TR><TD  ALIGN=left NOWRAP>drawing</TD>
<TD  ALIGN=left NOWRAP>filling</TD>
<TD  ALIGN=right NOWRAP>type</TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>plot</TT></TD>
<TD  ALIGN=left NOWRAP>&nbsp;</TD>
<TD  ALIGN=right NOWRAP><I>int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>lineto</TT></TD>
<TD  ALIGN=left NOWRAP>&nbsp;</TD>
<TD  ALIGN=right NOWRAP><I>int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP>&nbsp;</TD>
<TD  ALIGN=left NOWRAP><TT>fill_rect</TT></TD>
<TD  ALIGN=right NOWRAP><I>int -&gt; int -&gt; int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP>&nbsp;</TD>
<TD  ALIGN=left NOWRAP><TT>fill_poly</TT></TD>
<TD  ALIGN=right NOWRAP><I> ( int * int) array -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>draw_arc</TT></TD>
<TD  ALIGN=left NOWRAP><TT>fill_arc</TT></TD>
<TD  ALIGN=right NOWRAP><I>int -&gt; int -&gt; int -&gt; int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>draw_ellipse</TT></TD>
<TD  ALIGN=left NOWRAP><TT>fill_ellipse</TT></TD>
<TD  ALIGN=right NOWRAP><I>int -&gt; int -&gt; int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>draw_circle</TT></TD>
<TD  ALIGN=left NOWRAP><TT>fill_circle</TT></TD>
<TD  ALIGN=right NOWRAP><I>int -&gt; int -&gt; int -&gt; unit</I></TD>
</TR></TABLE>
</DIV>
<BR>
<DIV ALIGN=center>Figure 5.1: Drawing- and filling functions.</DIV><BR>

<A NAME="fig-fngraph"></A>
<DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV></BLOCKQUOTE>
Beware, the function <TT>lineto</TT> changes the position of the current
point to make drawing of vertices more convenient.<BR>
<BR>

<H5> Drawing polygons</H5> 
To give an example, we add drawing primitives which are not predefined. A
polygon is described by a table of its vertices.


<PRE><BR># <B>let</B><CODE> </CODE>draw_rect<CODE> </CODE>x0<CODE> </CODE>y0<CODE> </CODE>w<CODE> </CODE>h<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>a<CODE>,</CODE>b<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.current_point()<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE>x1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>x0<CODE>+</CODE>w<CODE> </CODE><B>and</B><CODE> </CODE>y1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>y0<CODE>+</CODE>h<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.moveto<CODE> </CODE>x0<CODE> </CODE>y0;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.lineto<CODE> </CODE>x0<CODE> </CODE>y1;<CODE> </CODE>Graphics.lineto<CODE> </CODE>x1<CODE> </CODE>y1;<CODE> </CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.lineto<CODE> </CODE>x1<CODE> </CODE>y0;<CODE> </CODE>Graphics.lineto<CODE> </CODE>x0<CODE> </CODE>y0;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.moveto<CODE> </CODE>a<CODE> </CODE>b;;<BR><CODE>val draw_rect : int -&gt; int -&gt; int -&gt; int -&gt; unit = &lt;fun&gt;</CODE><BR><BR># <B>let</B><CODE> </CODE>draw_poly<CODE> </CODE>r<CODE> </CODE><CODE>=</CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>a<CODE>,</CODE>b<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.current_point<CODE> </CODE>()<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>x0<CODE>,</CODE>y0<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>r<CODE>.</CODE><TT>(</TT><CODE>0</CODE><TT>)</TT><CODE> </CODE><B>in</B><CODE> </CODE>Graphics.moveto<CODE> </CODE>x0<CODE> </CODE>y0;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>for</B><CODE> </CODE>i<CODE> </CODE><CODE>=</CODE><CODE> </CODE><CODE>1</CODE><CODE> </CODE><B>to</B><CODE> </CODE><TT>(</TT>Array.length<CODE> </CODE>r<TT>)</TT><CODE>-</CODE><CODE>1</CODE><CODE> </CODE><B>do</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>x<CODE>,</CODE>y<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>r<CODE>.</CODE><TT>(</TT>i<TT>)</TT><CODE> </CODE><B>in</B><CODE> </CODE>Graphics.lineto<CODE> </CODE>x<CODE> </CODE>y<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>done</B>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.lineto<CODE> </CODE>x0<CODE> </CODE>y0;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.moveto<CODE> </CODE>a<CODE> </CODE>b;;<BR><CODE>val draw_poly : (int * int) array -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
Please note that these functions take the same arguments as the predefined
ones for filling forms. Like the other functions for drawing forms,
they do not change the current point.<BR>
<BR>

<H5> Illustrations in the painter's model</H5>
This example generates an illustration of a token ring network (figure
<A HREF="book-ora048.html#fig-tokenring">5.2</A>).
Each machine is represented by a small circle. We place the set
of machines on a big circle and draw a line between the connected
machines. The current position of the token in the network is indicated
by a small black disk.<BR>
<BR>
The function <TT>net_points</TT> generates the coordinates of the
machines in the network. The resulting data is stored in a table.


<PRE><BR># <B>let</B><CODE> </CODE>pi<CODE> </CODE><CODE>=</CODE><CODE> </CODE><CODE>3</CODE><CODE>.</CODE><CODE>1</CODE><CODE>4</CODE><CODE>1</CODE><CODE>5</CODE><CODE>9</CODE><CODE>2</CODE><CODE>7</CODE>;;<BR><CODE>val pi : float = 3.1415927</CODE><BR># <B>let</B><CODE> </CODE>net_points<CODE> </CODE><TT>(</TT>x<CODE>,</CODE>y<TT>)</TT><CODE> </CODE>l<CODE> </CODE>n<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>a<CODE> </CODE><CODE>=</CODE><CODE> </CODE><CODE>2</CODE><CODE>.</CODE><CODE> </CODE><CODE>*.</CODE><CODE> </CODE>pi<CODE> </CODE><CODE>/.</CODE><CODE> </CODE><TT>(</TT>float<CODE> </CODE>n<TT>)</TT><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><B>rec</B><CODE> </CODE>aux<CODE> </CODE><TT>(</TT>xa<CODE>,</CODE>ya<TT>)</TT><CODE> </CODE>i<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>if</B><CODE> </CODE>i<CODE> </CODE><CODE>&gt;</CODE><CODE> </CODE>n<CODE> </CODE><B>then</B><CODE> </CODE>[]<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>else</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>na<CODE> </CODE><CODE>=</CODE><CODE> </CODE><TT>(</TT>float<CODE> </CODE>i<TT>)</TT><CODE> </CODE><CODE>*.</CODE><CODE> </CODE>a<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>x1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>xa<CODE> </CODE><CODE>+</CODE><CODE> </CODE><TT>(</TT>int_of_float<CODE> </CODE><TT>(</TT><CODE> </CODE>cos<TT>(</TT>na<TT>)</TT><CODE> </CODE><CODE>*.</CODE><CODE> </CODE>l<TT>)</TT><TT>)</TT><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE>y1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>ya<CODE> </CODE><CODE>+</CODE><CODE> </CODE><TT>(</TT>int_of_float<CODE> </CODE><TT>(</TT><CODE> </CODE>sin<TT>(</TT>na<TT>)</TT><CODE> </CODE><CODE>*.</CODE><CODE> </CODE>l<TT>)</TT><TT>)</TT><CODE> </CODE><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>np<CODE> </CODE><CODE>=</CODE><CODE> </CODE><TT>(</TT>x1<CODE>,</CODE>y1<TT>)</TT><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>np::<TT>(</TT>aux<CODE> </CODE>np<CODE> </CODE><TT>(</TT>i<CODE>+</CODE><CODE>1</CODE><TT>)</TT><TT>)</TT><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE>Array.of_list<CODE> </CODE><TT>(</TT>aux<CODE> </CODE><TT>(</TT>x<CODE>,</CODE>y<TT>)</TT><CODE> </CODE><CODE>1</CODE><TT>)</TT>;;<BR><CODE>val net_points : int * int -&gt; float -&gt; int -&gt; (int * int) array = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
The function <TT>draw_net</TT> displays the connections, the machines and the
token.


<PRE><BR># <B>let</B><CODE> </CODE>draw_net<CODE> </CODE><TT>(</TT>x<CODE>,</CODE>y<TT>)</TT><CODE> </CODE>l<CODE> </CODE>n<CODE> </CODE>sc<CODE> </CODE>st<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>r<CODE> </CODE><CODE>=</CODE><CODE> </CODE>net_points<CODE> </CODE><TT>(</TT>x<CODE>,</CODE>y<TT>)</TT><CODE> </CODE>l<CODE> </CODE>n<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>draw_poly<CODE> </CODE>r;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>draw_machine<CODE> </CODE><TT>(</TT>x<CODE>,</CODE>y<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>Graphics.background;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_circle<CODE> </CODE>x<CODE> </CODE>y<CODE> </CODE>sc;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>Graphics.foreground;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.draw_circle<CODE> </CODE>x<CODE> </CODE>y<CODE> </CODE>sc<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Array.iter<CODE> </CODE>draw_machine<CODE> </CODE>r;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_circle<CODE> </CODE>x<CODE> </CODE>y<CODE> </CODE>st;;<BR><CODE>val draw_net : int * int -&gt; float -&gt; int -&gt; int -&gt; int -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>



<PRE>


</PRE>
<BR>
<BR>
The following function call corresponds to the left drawing in figure
<A HREF="book-ora048.html#fig-tokenring">5.2</A>.


<PRE><BR># draw_net<CODE> </CODE><TT>(</TT><CODE>1</CODE><CODE>4</CODE><CODE>0</CODE><CODE>,</CODE><CODE>2</CODE><CODE>0</CODE><TT>)</TT><CODE> </CODE><CODE>6</CODE><CODE>0</CODE><CODE>.</CODE><CODE>0</CODE><CODE> </CODE><CODE>1</CODE><CODE>0</CODE><CODE> </CODE><CODE>1</CODE><CODE>0</CODE><CODE> </CODE><CODE>3</CODE>;;<BR><CODE>- : unit = ()</CODE><BR>

</PRE>



<PRE><BR># save_screen<CODE> </CODE><CODE>"IMAGES/tokenring.caa"</CODE>;;<BR><CODE>- : unit = ()</CODE><BR>

</PRE>



<PRE>


</PRE>

<BLOCKQUOTE><DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV>
<DIV ALIGN=center>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=1>
<TR><TD  ALIGN=left NOWRAP><IMG SRC="book-ora007.gif"></TD>
<TD  ALIGN=left NOWRAP><IMG SRC="book-ora008.gif"></TD>
</TR></TABLE>
</DIV>
<BR>
<DIV ALIGN=center>Figure 5.2: Tokenring network.</DIV><BR>

<A NAME="fig-tokenring"></A>
<DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV></BLOCKQUOTE>
We note that the order of drawing objects is important. We first plot the
connections then the nodes. The drawing of network nodes erases some part
of the connecting lines. Therefore, there is no need to calculate the
point of intersection between the connection segments and the circles
of the vertices. The right illustration of figure <A HREF="book-ora048.html#fig-tokenring">5.2</A>
inverts the order in which the objects are displayed. We see that the
segments appear inside of the circles representing the nodes.<BR>
<BR>
<A NAME="toc63"></A>
<H3> Text</H3>
<A NAME="subsec-texte"></A>
The functions for displaying texts are rather simple. The two
functions <TT>draw_char</TT> (of type <I>char -&gt; unit</I>) and
<TT>draw_string</TT> (of type <I>string -&gt; unit</I>) display a
character and a character string respectively at the current point.
After displaying, the latter is modified. These functions do not change
the current font and its current size.<BR>
<BR>


<H3> Note </H3> <HR>

The displaying of strings may differ depending on the graphical interface.


<HR>

<BR>
<BR>
The function <TT>text_size</TT> takes a string as input and returns a
pair of integers that correspond to the dimensions of this string when
it is displayed in the current font and size.<BR>
<BR>

<H5> Displaying strings vertically</H5>
This example describes the function <TT>draw_string_v</TT>, which
displays a character string vertically at the current point. It is
used in figure <A HREF="book-ora048.html#fig-axetexte">5.3</A>. Each letter is displayed separately
by changing the vertical coordinate.


<PRE><BR># <B>let</B><CODE> </CODE>draw_string_v<CODE> </CODE><CODE> </CODE>s<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>xi<CODE>,</CODE>yi<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.current_point()<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE>l<CODE> </CODE><CODE>=</CODE><CODE> </CODE>String.length<CODE> </CODE>s<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE><TT>(</TT><CODE>_,</CODE>h<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.text_size<CODE> </CODE>s<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.draw_char<CODE> </CODE>s<CODE>.[</CODE><CODE>0</CODE><CODE>]</CODE>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>for</B><CODE> </CODE>i<CODE>=</CODE><CODE>1</CODE><CODE> </CODE><B>to</B><CODE> </CODE>l<CODE>-</CODE><CODE>1</CODE><CODE> </CODE><B>do</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT><CODE>_,</CODE>b<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.current_point()<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE>Graphics.moveto<CODE> </CODE>xi<CODE> </CODE><TT>(</TT>b<CODE>-</CODE>h<TT>)</TT>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.draw_char<CODE> </CODE>s<CODE>.[</CODE>i<CODE>]</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>done</B>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>a<CODE>,_</CODE><TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.current_point()<CODE> </CODE><B>in</B><CODE> </CODE>Graphics.moveto<CODE> </CODE>a<CODE> </CODE>yi;;<BR><CODE>val draw_string_v : string -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>

This function modifies the current point. After displaying, the point
is placed at the initial position offset by the width of one character.<BR>
<BR>
The following program permits displaying a legend around the axes
(figure <A HREF="book-ora048.html#fig-axetexte">5.3</A>) 


<PRE><BR>#<BR><CODE> </CODE>Graphics.moveto<CODE> </CODE><CODE>0</CODE><CODE> </CODE><CODE>1</CODE><CODE>5</CODE><CODE>0</CODE>;<CODE> </CODE>Graphics.lineto<CODE> </CODE><CODE>3</CODE><CODE>0</CODE><CODE>0</CODE><CODE> </CODE><CODE>1</CODE><CODE>5</CODE><CODE>0</CODE>;<BR><CODE> </CODE>Graphics.moveto<CODE> </CODE><CODE>2</CODE><CODE> </CODE><CODE>1</CODE><CODE>3</CODE><CODE>0</CODE>;<CODE> </CODE>Graphics.draw_string<CODE> </CODE><CODE>"abscissa"</CODE>;<BR><CODE> </CODE>Graphics.moveto<CODE> </CODE><CODE>1</CODE><CODE>5</CODE><CODE>0</CODE><CODE> </CODE><CODE>0</CODE>;<CODE> </CODE>Graphics.lineto<CODE> </CODE><CODE>1</CODE><CODE>5</CODE><CODE>0</CODE><CODE> </CODE><CODE>3</CODE><CODE>0</CODE><CODE>0</CODE>;<BR><CODE> </CODE>Graphics.moveto<CODE> </CODE><CODE>1</CODE><CODE>3</CODE><CODE>5</CODE><CODE> </CODE><CODE>2</CODE><CODE>8</CODE><CODE>0</CODE>;<CODE> </CODE>draw_string_v<CODE> </CODE><CODE>"ordinate"</CODE>;;<BR><CODE>- : unit = ()</CODE><BR>

</PRE>
<BR>
<BR>
<BLOCKQUOTE><DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV>
<DIV ALIGN=center>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=1>
<TR><TD  ALIGN=left NOWRAP><IMG SRC="book-ora009.gif"></TD>
</TR></TABLE>
</DIV>
<BR>
<DIV ALIGN=center>Figure 5.3: Legend around axes.</DIV><BR>

<A NAME="fig-axetexte"></A>
<DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV></BLOCKQUOTE>If we wish to realize vertical displaying of text, it is necessary
to account for the fact that the current point is modified by the
function <TT>draw_string_v</TT>. To do this, we define the function
<TT>draw_text_v</TT>, which accepts the spacing between columns and
a list of words as parameters.


<PRE><BR># <B>let</B><CODE> </CODE>draw_text_v<CODE> </CODE>n<CODE> </CODE>l<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>f<CODE> </CODE>s<CODE> </CODE><CODE>=</CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>a<CODE>,</CODE>b<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.current_point()<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE>draw_string_v<CODE> </CODE>s;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.moveto<CODE> </CODE><TT>(</TT>a<CODE>+</CODE>n<TT>)</TT><CODE> </CODE>b<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><CODE> </CODE>List.iter<CODE> </CODE>f<CODE> </CODE>l;;<BR><CODE>val draw_text_v : int -&gt; string list -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
If we need further text transformations like, for example, rotation,
we will have to take the <EM>bitmap</EM> of each letter and perform the
rotation on this set of pixels.<BR>
<BR>
<A NAME="toc64"></A>
<H3> Bitmaps</H3><A NAME="@fonctions168"></A>
A bitmap may be represented by either a color matrix (<I>color
array array</I>) or a value of abstract type <A NAME="text14" HREF="book-ora055.html#note14"><SUP><FONT SIZE=2>1</FONT></SUP></A> <I>image</I>,
which is declared in library <TT>Graphics</TT>. The names and types of the
functions for manipulating bitmaps are given in figure <A HREF="book-ora048.html#fig-bitmaps">5.4</A>.<BR>
<BR>
<A NAME="@fonctions169"></A>
<A NAME="@fonctions170"></A>
<A NAME="@fonctions171"></A>
<A NAME="@fonctions172"></A>
<A NAME="@fonctions173"></A>
<A NAME="@fonctions174"></A>
<BLOCKQUOTE><DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV>
<DIV ALIGN=center>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=1>
<TR><TD  ALIGN=left NOWRAP>function</TD>
<TD  ALIGN=left NOWRAP>type</TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>make_image</TT></TD>
<TD  ALIGN=left NOWRAP><I>color array array -&gt; image</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>dump_image</TT></TD>
<TD  ALIGN=left NOWRAP><I>image -&gt; color array array</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>draw_image</TT></TD>
<TD  ALIGN=left NOWRAP><I>image -&gt; int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>get_image</TT></TD>
<TD  ALIGN=left NOWRAP><I>int -&gt; int -&gt; int -&gt; int -&gt; image</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>blit_image</TT></TD>
<TD  ALIGN=left NOWRAP><I>image -&gt; int -&gt; int -&gt; unit</I></TD>
</TR>
<TR><TD  ALIGN=left NOWRAP><TT>create_image</TT></TD>
<TD  ALIGN=left NOWRAP><I>int -&gt; int -&gt; image</I></TD>
</TR></TABLE>
<BR>
<DIV ALIGN=center>Figure 5.4: Functions for manipulating bitmaps.</DIV><BR>

<A NAME="fig-bitmaps"></A>
</DIV>
<DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV></BLOCKQUOTE>The functions <TT>make_image</TT> and <TT>dump_image</TT> are
conversion functions between types <I>image</I> and <I>color array
array</I>. The function <TT>draw_image</TT> displays a bitmap starting at
the coordinates of its bottom left corner.<BR>
<BR>
The other way round, one can capture a rectangular part of the screen to
create an image using the function <TT>get_image</TT> and by indicating
the bottom left corner and the upper right one of the area to be captured.
The function <TT>blit_image</TT> modifies its first parameter (of
type <I>image</I>) and captures the region of the screen where the
lower left corner is given by the point passed as parameter. The size
of the captured region is the one of the image argument. The function
<TT>create_image</TT> allows initializing images by specifying their
size to use them with <TT>blit_image</TT>.<BR>
<BR>
The predefined color <TT>transp</TT> can be used to create transparent
points in an image. This makes it possible to display an image within a
rectangular area only; the transparent points do not modify the initial
screen.<BR>
<BR>

<H5> Polarization of Jussieu</H5>
This example inverts the color of points of a bitmap. To do this, we use
the function for color inversion presented on page <A HREF="book-ora048.html#sec-couleur">??</A>,
applying it to each pixel of a bitmap.


<PRE><BR># <B>let</B><CODE> </CODE>inv_image<CODE> </CODE>i<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>inv_vec<CODE> </CODE><CODE>=</CODE><CODE> </CODE>Array.map<CODE> </CODE><TT>(</TT><B>fun</B><CODE> </CODE>c<CODE> </CODE>-&gt;<CODE> </CODE>inv_color<CODE> </CODE>c<TT>)</TT><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>inv_mat<CODE> </CODE><CODE>=</CODE><CODE> </CODE>Array.map<CODE> </CODE>inv_vec<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>inverted_matrix<CODE> </CODE><CODE>=</CODE><CODE> </CODE>inv_mat<CODE> </CODE><TT>(</TT>Graphics.dump_image<CODE> </CODE>i<TT>)</TT><CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.make_image<CODE> </CODE>inverted_matrix;;<BR><CODE>val inv_image : Graphics.image -&gt; Graphics.image = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
Given the bitmap <TT>jussieu</TT>, which is displayed in the left half
of figure <A HREF="book-ora048.html#fig-jussieu">5.5</A>, we use the function <TT>inv_image</TT>
and obtain a new ``solarized'' bitmap, which is displayed in the right
half of the same figure.<BR>
<BR>


<PRE><BR># <B>let</B><CODE> </CODE>f_jussieu2<CODE> </CODE>()<CODE> </CODE><CODE>=</CODE><CODE> </CODE>inv_image<CODE> </CODE>jussieu1;;<CODE> </CODE><BR><CODE>val f_jussieu2 : unit -&gt; Graphics.image = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
<BLOCKQUOTE><DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV>
<DIV ALIGN=center>
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=1>
<TR><TD  ALIGN=left NOWRAP><IMG SRC="book-ora010.gif"></TD>
<TD  ALIGN=left NOWRAP><IMG SRC="book-ora011.gif"></TD>
</TR></TABLE>
</DIV>
<BR>
<DIV ALIGN=center>Figure 5.5: Inversion of Jussieu.</DIV><BR>

<A NAME="fig-jussieu"></A>
<DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV></BLOCKQUOTE><A NAME="toc65"></A>
<H3> Example: drawing of boxes with relief patterns</H3>
<A NAME="sec-boites"></A>
In this example we will define a few utility functions for drawing boxes
that carry relief patterns. A box is a generic object that is useful in
many cases. It is inscribed in a rectangle which is characterized by a
point of origin, a height and a width.<BR>
<BR>
<TABLE CELLSPACING=2 CELLPADDING=0>
<TR><TD  ALIGN=center NOWRAP>
<TABLE CELLSPACING=2 CELLPADDING=0>
<TR><TD  VALIGN=top ALIGN=left>To give an impression of a box with a relief pattern, it is sufficient
to surround it with two trapezoids in a light color and two others in
a somewhat darker shade.</TD>
</TR></TABLE></TD>
<TD  ALIGN=center NOWRAP>&nbsp;&nbsp;</TD>
<TD  ALIGN=center NOWRAP><IMG SRC="book-ora012.gif"></TD>
</TR></TABLE><BR>
<TABLE CELLSPACING=2 CELLPADDING=0>
<TR><TD  ALIGN=center NOWRAP>
<TABLE CELLSPACING=2 CELLPADDING=0>
<TR><TD  VALIGN=top ALIGN=left>Inverting the colors, one can give the impression that the boxes are on
top or at the bottom.</TD>
</TR></TABLE></TD>
<TD  ALIGN=center NOWRAP>&nbsp;</TD>
<TD  ALIGN=center NOWRAP><IMG SRC="book-ora013.gif"></TD>
</TR></TABLE><BR>

<H5> Implementation</H5>
We add the border width, the display mode (top, bottom, flat) and the
colors of its edges and of its bottom.
This information is collected in a record.


<PRE><BR># <B>type</B><CODE> </CODE>relief<CODE> </CODE><CODE>=</CODE><CODE> </CODE>Top<CODE> </CODE><CODE>|</CODE><CODE> </CODE>Bot<CODE> </CODE><CODE>|</CODE><CODE> </CODE>Flat;;<BR># <B>type</B><CODE> </CODE>box_config<CODE> </CODE><CODE>=</CODE><BR><CODE> </CODE><CODE> </CODE>{<CODE> </CODE>x<CODE>:</CODE>int;<CODE> </CODE>y<CODE>:</CODE>int;<CODE> </CODE>w<CODE>:</CODE>int;<CODE> </CODE>h<CODE>:</CODE>int;<CODE> </CODE>bw<CODE>:</CODE>int;<CODE> </CODE><B>mutable</B><CODE> </CODE>r<CODE>:</CODE>relief;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>b1_col<CODE> </CODE><CODE>:</CODE><CODE> </CODE>Graphics.color;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>b2_col<CODE> </CODE><CODE>:</CODE><CODE> </CODE>Graphics.color;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>b_col<CODE> </CODE><CODE>:</CODE><CODE> </CODE>Graphics.color};;<BR>

</PRE>

Only field <TT>r</TT> can be modified.
We use the function <TT>draw_rect</TT> defined at page
<A HREF="book-ora048.html#sub-traces-remplissage">??</A>, which draws a rectangle.<BR>
<BR>
For convenience, we define a function for drawing the outline of a box.


<PRE><BR># <B>let</B><CODE> </CODE>draw_box_outline<CODE> </CODE>bcf<CODE> </CODE>col<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>col;<BR><CODE> </CODE><CODE> </CODE>draw_rect<CODE> </CODE>bcf<CODE>.</CODE>x<CODE> </CODE>bcf<CODE>.</CODE>y<CODE> </CODE>bcf<CODE>.</CODE>w<CODE> </CODE><CODE> </CODE>bcf<CODE>.</CODE>h;;<BR><CODE>val draw_box_outline : box_config -&gt; Graphics.color -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
The function of displaying a box consists of three parts: drawing the
first edge, drawing the second edge and drawing the interior of the box.


<PRE><BR># <B>let</B><CODE> </CODE>draw_box<CODE> </CODE>bcf<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>x1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>bcf<CODE>.</CODE>x<CODE> </CODE><B>and</B><CODE> </CODE>y1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>bcf<CODE>.</CODE>y<CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>x2<CODE> </CODE><CODE>=</CODE><CODE> </CODE>x1<CODE>+</CODE>bcf<CODE>.</CODE>w<CODE> </CODE><B>and</B><CODE> </CODE>y2<CODE> </CODE><CODE>=</CODE><CODE> </CODE>y1<CODE>+</CODE>bcf<CODE>.</CODE>h<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>ix1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>x1<CODE>+</CODE>bcf<CODE>.</CODE>bw<CODE> </CODE><B>and</B><CODE> </CODE>ix2<CODE> </CODE><CODE>=</CODE><CODE> </CODE>x2<CODE>-</CODE>bcf<CODE>.</CODE>bw<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE>iy1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>y1<CODE>+</CODE>bcf<CODE>.</CODE>bw<CODE> </CODE><B>and</B><CODE> </CODE>iy2<CODE> </CODE><CODE>=</CODE><CODE> </CODE>y2<CODE>-</CODE>bcf<CODE>.</CODE>bw<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>border1<CODE> </CODE>g<CODE> </CODE><CODE>=</CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>g;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_poly<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE>[|</CODE><CODE> </CODE><TT>(</TT>x1<CODE>,</CODE>y1<TT>)</TT>;<TT>(</TT>ix1<CODE>,</CODE>iy1<TT>)</TT>;<TT>(</TT>ix2<CODE>,</CODE>iy1<TT>)</TT>;<TT>(</TT>ix2<CODE>,</CODE>iy2<TT>)</TT>;<TT>(</TT>x2<CODE>,</CODE>y2<TT>)</TT>;<TT>(</TT>x2<CODE>,</CODE>y1<TT>)</TT><CODE> </CODE><CODE>|]</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>border2<CODE> </CODE>g<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>g;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_poly<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE>[|</CODE><CODE> </CODE><TT>(</TT>x1<CODE>,</CODE>y1<TT>)</TT>;<TT>(</TT>ix1<CODE>,</CODE>iy1<TT>)</TT>;<TT>(</TT>ix1<CODE>,</CODE>iy2<TT>)</TT>;<TT>(</TT>ix2<CODE>,</CODE>iy2<TT>)</TT>;<TT>(</TT>x2<CODE>,</CODE>y2<TT>)</TT>;<TT>(</TT>x1<CODE>,</CODE>y2<TT>)</TT><CODE> </CODE><CODE>|]</CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>bcf<CODE>.</CODE>b_col;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><TT>(</TT><CODE> </CODE><B>match</B><CODE> </CODE>bcf<CODE>.</CODE>r<CODE> </CODE><B>with</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Top<CODE> </CODE><CODE> </CODE>-&gt;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_rect<CODE> </CODE>ix1<CODE> </CODE>iy1<CODE> </CODE><TT>(</TT>ix2<CODE>-</CODE>ix1<TT>)</TT><CODE> </CODE><TT>(</TT>iy2<CODE>-</CODE>iy1<TT>)</TT>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>border1<CODE> </CODE>bcf<CODE>.</CODE>b1_col;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>border2<CODE> </CODE>bcf<CODE>.</CODE>b2_col<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE>|</CODE><CODE> </CODE>Bot<CODE> </CODE><CODE> </CODE>-&gt;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_rect<CODE> </CODE>ix1<CODE> </CODE>iy1<CODE> </CODE><TT>(</TT>ix2<CODE>-</CODE>ix1<TT>)</TT><CODE> </CODE><TT>(</TT>iy2<CODE>-</CODE>iy1<TT>)</TT>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>border1<CODE> </CODE>bcf<CODE>.</CODE>b2_col;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>border2<CODE> </CODE>bcf<CODE>.</CODE>b1_col<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE>|</CODE><CODE> </CODE>Flat<CODE> </CODE>-&gt;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_rect<CODE> </CODE>x1<CODE> </CODE>y1<CODE> </CODE>bcf<CODE>.</CODE>w<CODE> </CODE>bcf<CODE>.</CODE>h<CODE> </CODE><TT>)</TT>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE>draw_box_outline<CODE> </CODE>bcf<CODE> </CODE>Graphics.black;;<BR><CODE>val draw_box : box_config -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
The outline of boxes is highlighted in black. Erasing a box fills the
area it covers with the background color.


<PRE><BR># <B>let</B><CODE> </CODE>erase_box<CODE> </CODE>bcf<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>bcf<CODE>.</CODE>b_col;<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.fill_rect<CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>x<CODE>+</CODE>bcf<CODE>.</CODE>bw<TT>)</TT><CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>y<CODE>+</CODE>bcf<CODE>.</CODE>bw<TT>)</TT><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>w<CODE>-</CODE><TT>(</TT><CODE>2</CODE><CODE>*</CODE>bcf<CODE>.</CODE>bw<TT>)</TT><TT>)</TT><CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>h<CODE>-</CODE><TT>(</TT><CODE>2</CODE><CODE>*</CODE>bcf<CODE>.</CODE>bw<TT>)</TT><TT>)</TT>;;<BR><CODE>val erase_box : box_config -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
Finally, we define a function for displaying a character string at the
left, right or in the middle of the box. We use the type <I>position</I>
to describe the placement of the string.


<PRE><BR># <B>type</B><CODE> </CODE>position<CODE> </CODE><CODE>=</CODE><CODE> </CODE>Left<CODE> </CODE><CODE>|</CODE><CODE> </CODE>Center<CODE> </CODE><CODE>|</CODE><CODE> </CODE>Right;;<CODE> </CODE><BR><CODE>type position = | Left | Center | Right</CODE><BR># <B>let</B><CODE> </CODE>draw_string_in_box<CODE> </CODE>pos<CODE> </CODE>str<CODE> </CODE>bcf<CODE> </CODE>col<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE><TT>(</TT>w<CODE>,</CODE><CODE> </CODE>h<TT>)</TT><CODE> </CODE><CODE>=</CODE><CODE> </CODE>Graphics.text_size<CODE> </CODE>str<CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>ty<CODE> </CODE><CODE>=</CODE><CODE> </CODE>bcf<CODE>.</CODE>y<CODE> </CODE><CODE>+</CODE><CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>h<CODE>-</CODE>h<TT>)</TT><CODE>/</CODE><CODE>2</CODE><CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><TT>(</TT><CODE> </CODE><B>match</B><CODE> </CODE>pos<CODE> </CODE><B>with</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Center<CODE> </CODE>-&gt;<CODE> </CODE>Graphics.moveto<CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>x<CODE> </CODE><CODE>+</CODE><CODE> </CODE><TT>(</TT>bcf<CODE>.</CODE>w<CODE>-</CODE>w<TT>)</TT><CODE>/</CODE><CODE>2</CODE><TT>)</TT><CODE> </CODE>ty<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE>|</CODE><CODE> </CODE>Right<CODE> </CODE><CODE> </CODE>-&gt;<CODE> </CODE><B>let</B><CODE> </CODE>tx<CODE> </CODE><CODE>=</CODE><CODE> </CODE>bcf<CODE>.</CODE>x<CODE> </CODE><CODE>+</CODE><CODE> </CODE>bcf<CODE>.</CODE>w<CODE> </CODE><CODE>-</CODE><CODE> </CODE>w<CODE> </CODE><CODE>-</CODE><CODE> </CODE>bcf<CODE>.</CODE>bw<CODE> </CODE><CODE>-</CODE><CODE> </CODE><CODE>1</CODE><CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.moveto<CODE> </CODE>tx<CODE> </CODE>ty<CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE>|</CODE><CODE> </CODE>Left<CODE> </CODE><CODE> </CODE><CODE> </CODE>-&gt;<CODE> </CODE><B>let</B><CODE> </CODE>tx<CODE> </CODE><CODE>=</CODE><CODE> </CODE>bcf<CODE>.</CODE>x<CODE> </CODE><CODE>+</CODE><CODE> </CODE>bcf<CODE>.</CODE>bw<CODE> </CODE><CODE>+</CODE><CODE> </CODE><CODE>1</CODE><CODE> </CODE><B>in</B><CODE> </CODE>Graphics.moveto<CODE> </CODE>tx<CODE> </CODE>ty<CODE> </CODE><CODE> </CODE><TT>)</TT>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.set_color<CODE> </CODE>col;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>Graphics.draw_string<CODE> </CODE>str;;<BR><CODE>val draw_string_in_box :</CODE><BR><CODE>  position -&gt; string -&gt; box_config -&gt; Graphics.color -&gt; unit = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>

<H5> Example: drawing of a game</H5>
We illustrate the use of boxes by displaying the position of a game of
type ``tic-tac-toe'' as shown in figure <A HREF="book-ora048.html#fig-boites2">5.6</A>. To simplify
the creation of boxes, we predefine colors.


<PRE><BR># <B>let</B><CODE> </CODE>set_gray<CODE> </CODE>x<CODE> </CODE><CODE>=</CODE><CODE> </CODE><CODE> </CODE><TT>(</TT>Graphics.rgb<CODE> </CODE>x<CODE> </CODE>x<CODE> </CODE>x<TT>)</TT>;;<BR><CODE>val set_gray : int -&gt; Graphics.color = &lt;fun&gt;</CODE><BR># <B>let</B><CODE> </CODE>gray1<CODE>=</CODE><CODE> </CODE>set_gray<CODE> </CODE><CODE>1</CODE><CODE>0</CODE><CODE>0</CODE><CODE> </CODE><B>and</B><CODE> </CODE>gray2<CODE>=</CODE><CODE> </CODE>set_gray<CODE> </CODE><CODE>1</CODE><CODE>7</CODE><CODE>0</CODE><CODE> </CODE><B>and</B><CODE> </CODE>gray3<CODE>=</CODE><CODE> </CODE>set_gray<CODE> </CODE><CODE>2</CODE><CODE>4</CODE><CODE>0</CODE>;;<BR><CODE>val gray1 : Graphics.color = 6579300</CODE><BR><CODE>val gray2 : Graphics.color = 11184810</CODE><BR><CODE>val gray3 : Graphics.color = 15790320</CODE><BR>

</PRE>
<BR>
<BR>
We define a function for creating a grid of boxes of same size.


<PRE><BR># <B>let</B><CODE> </CODE><B>rec</B><CODE> </CODE>create_grid<CODE> </CODE>nb_col<CODE> </CODE>n<CODE> </CODE>sep<CODE> </CODE>b<CODE> </CODE><CODE> </CODE><CODE>=</CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>if</B><CODE> </CODE>n<CODE> </CODE><CODE>&lt;</CODE><CODE> </CODE><CODE>0</CODE><CODE> </CODE><B>then</B><CODE> </CODE>[]<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>else</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>px<CODE> </CODE><CODE>=</CODE><CODE> </CODE>n<CODE> </CODE><B>mod</B><CODE> </CODE>nb_col<CODE> </CODE><B>and</B><CODE> </CODE>py<CODE> </CODE><CODE>=</CODE><CODE> </CODE>n<CODE> </CODE><CODE>/</CODE><CODE> </CODE>nb_col<CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>nx<CODE> </CODE><CODE>=</CODE><CODE> </CODE>b<CODE>.</CODE>x<CODE> </CODE><CODE>+</CODE>sep<CODE> </CODE><CODE>+</CODE><CODE> </CODE>px<CODE>*</CODE><TT>(</TT>b<CODE>.</CODE>w<CODE>+</CODE>sep<TT>)</TT><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>and</B><CODE> </CODE>ny<CODE> </CODE><CODE>=</CODE><CODE> </CODE>b<CODE>.</CODE>y<CODE> </CODE><CODE>+</CODE>sep<CODE> </CODE><CODE>+</CODE><CODE> </CODE>py<CODE>*</CODE><TT>(</TT>b<CODE>.</CODE>h<CODE>+</CODE>sep<TT>)</TT><CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>b1<CODE> </CODE><CODE>=</CODE><CODE> </CODE>{b<CODE> </CODE><B>with</B><CODE> </CODE>x<CODE>=</CODE>nx;<CODE> </CODE>y<CODE>=</CODE>ny}<CODE> </CODE><B>in</B><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>b1::<TT>(</TT>create_grid<CODE> </CODE>nb_col<CODE> </CODE><TT>(</TT>n<CODE>-</CODE><CODE>1</CODE><TT>)</TT><CODE> </CODE>sep<CODE> </CODE>b<TT>)</TT>;;<BR><CODE>val create_grid : int -&gt; int -&gt; int -&gt; box_config -&gt; box_config list = &lt;fun&gt;</CODE><BR>

</PRE>
<BR>
<BR>
And we create the vector of boxes:


<PRE><BR># <B>let</B><CODE> </CODE>vb<CODE> </CODE><CODE>=</CODE><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><B>let</B><CODE> </CODE>b<CODE> </CODE><CODE>=</CODE><CODE> </CODE><CODE> </CODE>{x<CODE>=</CODE><CODE>0</CODE>;<CODE> </CODE>y<CODE>=</CODE><CODE>0</CODE>;<CODE> </CODE>w<CODE>=</CODE><CODE>2</CODE><CODE>0</CODE>;h<CODE>=</CODE><CODE>2</CODE><CODE>0</CODE>;<CODE> </CODE>bw<CODE>=</CODE><CODE>2</CODE>;<BR><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE><CODE> </CODE>b1_col<CODE>=</CODE>gray1;<CODE> </CODE>b2_col<CODE>=</CODE>gray3;<CODE> </CODE>b_col<CODE>=</CODE>gray2;<CODE> </CODE>r<CODE>=</CODE>Top}<CODE> </CODE><B>in</B><CODE> </CODE><BR><CODE> </CODE><CODE> </CODE><CODE> </CODE>Array.of_list<CODE> </CODE><TT>(</TT>create_grid<CODE> </CODE><CODE>5</CODE><CODE> </CODE><CODE>2</CODE><CODE>4</CODE><CODE> </CODE><CODE>2</CODE><CODE> </CODE><CODE> </CODE>b<TT>)</TT>;;<BR><CODE>val vb : box_config array =</CODE><BR><CODE>  [|{x=90; y=90; w=20; h=20; bw=2; r=Top; b1_col=6579300; b2_col=15790320;</CODE><BR><CODE>     b_col=11184810};</CODE><BR><CODE>    {x=68; y=90; w=20; h=20; bw=2; r=Top; b1_col=6579300; b2_col=15790320;</CODE><BR><CODE>     b_col=...};</CODE><BR><CODE>    ...|]</CODE><BR>

</PRE>
<BR>
<BR>
Figure <A HREF="book-ora048.html#fig-boites2">5.6</A> corresponds to the following function calls:<BR>
<BR>


<PRE><BR># Array.iter<CODE> </CODE>draw_box<CODE> </CODE>vb;<BR><CODE> </CODE>draw_string_in_box<CODE> </CODE>Center<CODE> </CODE><CODE>"X"</CODE><CODE> </CODE>vb<CODE>.</CODE><TT>(</TT><CODE>5</CODE><TT>)</TT><CODE> </CODE>Graphics.black;<BR><CODE> </CODE>draw_string_in_box<CODE> </CODE>Center<CODE> </CODE><CODE>"X"</CODE><CODE> </CODE>vb<CODE>.</CODE><TT>(</TT><CODE>8</CODE><TT>)</TT><CODE> </CODE>Graphics.black;<BR><CODE> </CODE>draw_string_in_box<CODE> </CODE>Center<CODE> </CODE><CODE>"O"</CODE><CODE> </CODE>vb<CODE>.</CODE><TT>(</TT><CODE>1</CODE><CODE>2</CODE><TT>)</TT><CODE> </CODE>Graphics.yellow;<BR><CODE> </CODE>draw_string_in_box<CODE> </CODE>Center<CODE> </CODE><CODE>"O"</CODE><CODE> </CODE>vb<CODE>.</CODE><TT>(</TT><CODE>1</CODE><CODE>1</CODE><TT>)</TT><CODE> </CODE>Graphics.yellow;;<BR><CODE>- : unit = ()</CODE><BR>

</PRE>
<BR>
<BR>
<BLOCKQUOTE><DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV>
<DIV ALIGN=center>
<IMG SRC="book-ora014.gif">
</DIV>
<BR>
<DIV ALIGN=center>Figure 5.6: Displaying of boxes with text.</DIV><BR>

<A NAME="fig-boites2"></A>
<DIV ALIGN=center><HR WIDTH="80%" SIZE=2></DIV></BLOCKQUOTE><HR>
<A HREF="book-ora047.html"><IMG SRC ="previous_motif.gif" ALT="Previous"></A>
<A HREF="index.html"><IMG SRC ="contents_motif.gif" ALT="Contents"></A>
<A HREF="book-ora049.html"><IMG SRC ="next_motif.gif" ALT="Next"></A>
</BODY>
</HTML>
